<template>
    <div class="page">
      <!-- 搜索区域 开始 -->
      <div class="el_card_box">
        <el-form :inline="true" size="small" :model="formInline" class="search_form">
          <el-form-item label="关键词：">
            <el-input v-model="formInline.term" placeholder="关键词"></el-input>
          </el-form-item>
        </el-form>
        <div class="search_btn_box">
          <el-button type="primary" size="small" @click="onSearch">筛选</el-button>
          <el-button type="default" size="small" @click="rest">清空</el-button>
        </div>
      </div>
      <!-- 搜索区域 end -->
  
      <!-- 表格 开始 -->
      <div class="table_box">
  
        <!-- 操作区域 开始 -->
        <div class="action_box">
          <el-button type="primary" size="small" @click="addEvent()">新增SEO</el-button>
        </div>
        <!-- 操作区域 end -->
  
        <el-table ref="elTable" class="el_table" size="small" :data="tableData">
          <el-table-column prop="title" label="seo标题" show-overflow-tooltip />
          <el-table-column prop="type" label="页面名称" show-overflow-tooltip>
            <template slot-scope="{row}">{{ pageNameList[row.type] }}</template>
          </el-table-column>
          <el-table-column prop="platform" label="所属平台" show-overflow-tooltip />
          <el-table-column prop="keywords" label="seo关键词" show-overflow-tooltip />
          <el-table-column prop="description" label="seo描述" show-overflow-tooltip />
          <el-table-column prop="createdDate" label="创建时间" show-overflow-tooltip />
          <el-table-column prop="creator" label="创建人" show-overflow-tooltip />
          <el-table-column prop="orderNum" label="操作" width="160">
            <template slot-scope="{row}">
              <!-- <el-link type="primary" class="el_link" @click="updateInfo(row)">{{ row.onShelf == 1 ? '下架' : '上架' }}</el-link> -->
              <el-link type="primary" class="el_link" @click="addEvent(row.id)">编辑</el-link>
              <el-link type="danger" class="el_link" @click="removeInfo(row)">删除</el-link>
            </template>
          </el-table-column>
        </el-table>
        <div class="pagination_list">
          <el-pagination background layout="sizes, total,prev, pager, next, jumper" :total="pageTotal" :page-size="pageSize" :page-sizes="pageSizes" :current-page.sync="pageNumber" @current-change="getList" @size-change="changePageSize" />
        </div>
      </div>
      <!-- 表格 end -->
  
      <!-- 新增口腔问题弹框 开始 -->
      <AddPopup v-model="showPopup" type="service" :id="currentId" @change="getList"></AddPopup>
      <!-- 新增口腔问题弹框 end -->
    </div>
  </template>
      
      <script>
  import { showToast, showModal, deepClone } from "@/common/util";
  import {
    GET_FEATUREDSERVICES_SEARCH,
    DELETE_FEATUREDSERVICES_INFO,
    STARTSTOP_FEATUREDSERVICES_INFO,
  } from "@/http/configuration";
  import {GET_SEOSETTING_SEARCH,DELETE_SEOSETTING_INFO,STARTSTOP_SEOSETTING_INFO} from '@/http/system'
  import AddPopup from "./addSeo.vue";
  export default {
    components: {
      AddPopup,
    },
    data() {
      return {
        formInline: {},
        tableData: [],
        pageTotal: 0,
        pageNumber: 1,
        pageSizes: [10, 20, 50, 100],
        pageSize: 20,
        loading: false,
        showPopup: false,
        currentId: "",
        pageNameList:{
          0:'首页',
          1:'医院列表',
          2:'医生列表',
          3:'商品列表',
          4:'查价格',
          5:'查资质',
          6:'查案例',
          7:'口腔百科',
          8:'社区问答',
          9:'口腔报告',
          10:'机构入驻',
          11:'个人中心',
          12:'关于哩哩',
          13:'新闻资讯'
        }
      };
    },
    watch: {
      showPopup: {
        handler: function (n) {
          if (!n) {
            this.currentId = "";
          }
        },
        immediate: true,
      },
    },
    mounted() {
      this.getList();
    },
    methods: {
      /** 重置 */
      rest() {
        this.formInline = {};
        this.getList();
      },
  
      /** 每页展示 */
      changePageSize(e) {
        this.pageSize = e;
        this.getList();
      },
  
      /** 获取参数 */
      getParams() {
        let oParams = JSON.parse(JSON.stringify(this.formInline));
  
        oParams.pageNumber = this.pageNumber;
        oParams.pageSize = this.pageSize;
        return oParams;
      },
  
      /** 获取列表 */
      getList() {
        let _this = this;
        let oParams = this.getParams();
        GET_SEOSETTING_SEARCH(oParams).then((res) => {
          let obj = res.data || {};
          _this.tableData = obj.list || [];
          _this.pageTotal = obj.totalElements;
        });
      },
  
      // 新增
      addEvent(id) {
        this.showPopup = true;
        if (id) {
          this.currentId = id;
        }
      },
  
      // 删除
      removeInfo(row) {
        let _this = this;
        showModal({
          message: `确定删除该条数据吗？`,
          showCancelButton: true,
          success: function () {
            DELETE_SEOSETTING_INFO({ id: row.id }).then((res) => {
              if (res.code == 200) {
                showToast({
                  message: "删除成功",
                  type: "success",
                });
                _this.getList();
              }
            });
          },
        });
      },
  
      // 上下架
      updateInfo(row) {
        let _this = this;
        showModal({
          message: `确认${row.onShelf == 1 ? "下架" : "上架"}该SEO吗？`,
          showCancelButton: true,
          type: "warning",
          success: function () {
            STARTSTOP_SEOSETTING_INFO({ id: row.id }).then((res) => {
              if (res.code == 200) {
                showToast({
                  message: "操作成功",
                  type: "success",
                });
                _this.getList();
              }
            });
          },
        });
      },

      // 搜索
    onSearch(){
      this.pageNumber = 1;
      this.getList()
    }
    },
  };
  </script>
      
      <style lang="scss" scoped>
  @import "@/assets/style/customer/index.scss";
  </style>
      